<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>自动部署</title>
    <link rel="stylesheet" th:href="@{/static/css/layui.css}" href="css/layui.css">
    <style>
        table td,th{
            text-align: center !important;
        }
        table a{
            color: #01AAED;
        }
        .path{
            margin-left: 30px;
        }
        .download{
            color: #01AAED;
            cursor: pointer;
        }
    </style>
</head>

<body class="layui-layout-body">
<div class="layui-layout layui-layout-admin">

    <div th:replace="fragment/common::top">顶部</div>

    <div th:replace="fragment/common::left">菜单</div>

    <div class="layui-body">
        <fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
            <legend>日志列表</legend>
        </fieldset>
        <div  class="layui-form">
            <table class="layui-table">
                <colgroup>
                    <col width="400">
                    <col>
                </colgroup>
                <thead>
                    <tr>
                        <th>文件</th>
                        <th>操作</th>
                    </tr>
                </thead>
                <tbody id="list">
                    <tr v-for="item in items">
                        <td>{{item}}</td>
                        <td><span @click="download(item)" class="download">下载</span></td>
                    </tr>
                </tbody>
            </table>
        </div>
    </div>

</div>
<script th:src="@{/static/js/layui.js}" src="js/layui.js"></script>
<script th:src="@{/static/js/vue.min.js}"></script>
<script>
    layui.use(['element',"layer"], function () {
        var $ = layui.jquery;
        var element = layui.element;
        var  vm = new Vue({
            el:"#list",
            data:{
                items:[]
            },
            methods:{
                download:function (filename) {
                    window.open(ctx + "/log/download?filename=" + filename);
                }
            }
        });

        $.get(ctx + "/log/list",function (obj) {
            if(obj.state){
                vm.items = obj.model;
            }else{
                layer.msg(obj.message,{icon:2});
            }
        });
    });
</script>
</body>

</html>